<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/webpage/include/taglib.jsp"%>
<html>
<head>
	<title>供应商合同管理</title>
	<meta name="decorator" content="ani"/>
	<script type="text/javascript" src="${ctxStatic}/plugin/select/jquery.combo.select.js"></script>
	<style>
			/**
     * Variables
     */
			/**
             * Wrapper
             */
		.combo-select {
			position: relative;
			max-width: 400px;
			margin-bottom: 15px;
			font: 100% Helvetica, Arial, Sans-serif;
			border: 1px #ccc solid;
			border-radius: 3px; }
		.combo-select .combo-input {
			margin-bottom: 0; }

		/**
         * Input field
         */
		.combo-input {
			-webkit-appearance: none;
			-moz-appearance: none;
			appearance: none;
			margin: 0;
			text-overflow: ellipsis;
			white-space: nowrap;
			border: none;
			width: 100%;
			box-sizing: border-box;
			padding: 12px;
			padding-right: 60px;
			border-radius: 3px; }
		.combo-input:focus {
			outline: none; }

		/**
         * Arrow
         */
		.combo-arrow {
			position: absolute;
			right: 0;
			top: 0;
			height: 100%;
			cursor: pointer;
			text-align: center;
			font-size: 14px;
			width: 40px;
			font-size: 12px;
			color: #999999; }
		.combo-arrow:before {
			content: " ";
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			border-top: 5px solid #cccccc;
			display: block;
			width: 0;
			height: 0;
			top: 0;
			right: 15px;
			bottom: 0;
			position: absolute;
			margin: auto 0; }

		/**
         * When opened
         */
		.combo-open .combo-arrow {
			border-color: #51A7E8; }
		.combo-open .combo-arrow:before {
			border-top: none;
			border-bottom: 5px solid #cccccc; }

		/**
         * When focused
         */
		.combo-focus {
			box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
			border-color: #51A7E8; }
		.combo-focus input {
			border-color: #51A7E8; }

		/**
         * Hide native select
         */
		.combo-select select {
			position: absolute;
			z-index: 1;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			-webkit-appearance: none;
			opacity: 0; }

		@media only screen and (min-width: 960px) {
			.combo-select select {
				left: -1px;
				top: -1px;
				width: 0;
				height: 0;
				margin: 0; } }
		/**
         * Selected option
         */
		.option-selected {
			background-color: #eee; }

		/**
         * Hovered option
         */
		.option-hover {
			background-color: #006eab;
			color: #fff; }

		/**
         * Option item
         */
		.option-item {
			cursor: pointer;
			border-bottom: 1px #e3e3e3 solid; }
		.option-item:hover {
			background-color: #006eab;
			color: #fff; }
		.option-item:last-child {
			border-bottom: none; }

		/**
         * Disabled and optgroups
         */
		.option-group {
			cursor: text;
			font-weight: 600;
			background: #e1e1e1;
			border: 1px #ccc solid;
			border-width: 1px 0; }

		/**
         * Disabled
         */
		.option-disabled {
			opacity: 0.5; }

		/**
         * Dropdown
         */
		.combo-dropdown {
			position: absolute;
			z-index: 1;
			top: 100%;
			left: 0;
			min-width: 100%;
			max-width: 300px;
			max-height: 300px;
			margin: 0;
			padding: 0;
			display: none;
			overflow-y: auto;
			background: #fff;
			border: 1px solid #999999;
			border-radius: 0;
			box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
			box-sizing: border-box; }
		.combo-dropdown li {
			list-style: none;
			padding: 8px 1em;
			margin: 0; }

		/**
         * On Active
         */
		.combo-open .combo-dropdown {
			display: block; }

		/**
         * Search marker
         */
		.combo-marker {
			text-decoration: underline; }

	</style>
	<script type="text/javascript">

		$(document).ready(function() {
			$("#inputForm").validate({
				submitHandler: function(form){
					jp.loading();
					form.submit();
				},
				errorContainer: "#messageBox",
				errorPlacement: function(error, element) {
					$("#messageBox").text("输入有误，请先更正。");
					if (element.is(":checkbox")||element.is(":radio")||element.parent().is(".input-append")){
						error.appendTo(element.parent().parent());
					} else {
						error.insertAfter(element);
					}
				}
			});
			
	        $('#startDate').datetimepicker({
				 format: "YYYY-MM-DD"
		    });
            $('#endDate').datetimepicker({
                format: "YYYY-MM-DD"
            });
		});
	</script>
	<script>
        $(function() {
            $('select').comboSelect();
        });
	</script>
</head>
<body>
<div class="wrapper wrapper-content">				
<div class="row">
	<div class="col-md-12">
	<div class="panel panel-primary">
		<div class="panel-heading">
			<h3 class="panel-title"> 
				<a class="panelButton" href="${ctx}/supplier/contract"><i class="ti-angle-left"></i> 返回</a>
			</h3>
		</div>
		<div class="panel-body">
		<form:form id="inputForm" modelAttribute="contract" action="${ctx}/supplier/contract/save" method="post" class="form-horizontal">
		<form:hidden path="id"/>
		<sys:message content="${message}"/>


                <div class="form-group">
                    <label class="col-sm-2 control-label">合同名称：</label>
                    <div class="col-sm-10">
                        <form:input path="contractName" htmlEscape="false" class="form-control  required"/>
                    </div>
                </div>
				<div class="form-group">
					<label class="col-sm-2 control-label">合同开始时间：</label>
					<div class="col-sm-10">
						<p class="input-group">
							<div class='input-group form_datetime' id='startDate'>
			                    <input type='text'  name="startDate" class="form-control  required"  value="<fmt:formatDate value="${contract.startDate}" pattern="yyyy-MM-dd"/>"/>
			                    <span class="input-group-addon">
			                        <span class="glyphicon glyphicon-calendar"></span>
			                    </span>
			                </div>						            
			            </p>
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-2 control-label">合同结束时间：</label>
					<div class="col-sm-10">

                        <p class="input-group">
                        <div class='input-group form_datetime' id='endDate'>
                            <input type='text' name="endDate" class="form-control  required"
                                   value="<fmt:formatDate value="${contract.endDate}" pattern="yyyy-MM-dd"/>"/>
                            <span class="input-group-addon">
			                        <span class="glyphicon glyphicon-calendar"></span>
			                    </span>
                        </div>
                        </p>
					</div>
				</div>


			<div class="form-group">
				<label class="col-sm-2 control-label">供应商：</label>
				<div class="col-sm-10">
					<form:select path="supplierId" class="form-control  required">
						<form:option value="" label="请选择"/>
						<c:forEach items="${supplierList}" var="it">
							<form:option value="${it.id}" label="${it.supplierName}"/>
						</c:forEach>
					</form:select>

				</div>
			</div>


				<div class="form-group">
					<label class="col-sm-2 control-label">付款方式：</label>
					<div class="col-sm-10">
						<form:select path="payMethod" class="form-control  required">
							<form:option value="" label="请选择"/>
							<form:options items="${fns:getDictList('sc_pay_method')}" itemLabel="label" itemValue="value" htmlEscape="false"/>
						</form:select>
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-2 control-label">是否续签：</label>
					<div class="col-sm-10">
                        <form:select path="isRenew" class="form-control  required">
							<form:option value="" label="请选择"/>
							<form:options items="${fns:getDictList('sc_is_renewal')}" itemLabel="label" itemValue="value" htmlEscape="false"/>
						</form:select>
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-2 control-label"> 账期期限：</label>
					<div class="col-sm-10">
						<form:input path="accountPeriod" htmlEscape="false"    class="form-control  required"/>
					</div>
				</div>
				<div class="form-group">
					<label class="col-sm-2 control-label">承兑期限：</label>
					<div class="col-sm-10">
						<form:input path="acceptancePeriod" htmlEscape="false"    class="form-control  required"/>
					</div>
				</div>
            <div class="form-group">
                <label class="col-sm-2 control-label">备注信息：</label>
                <div class="col-sm-10">
                    <form:textarea path="remarks" htmlEscape="false" rows="4" class="form-control "/>
                </div>
            </div>
		<c:if test="${fns:hasPermission('supplier:contract:edit') || isAdd}">
				<div class="col-lg-3"></div>
		        <div class="col-lg-6">
		             <div class="form-group text-center">
		                 <div>
		                     <button class="btn btn-primary btn-block btn-lg btn-parsley" data-loading-text="正在提交...">提 交</button>
		                 </div>
		             </div>
		        </div>
		</c:if>
		</form:form>
		</div>				
	</div>
	</div>
</div>
</div>
</body>
</html>